<style type="text/css">
	 .line_item {
		padding: 5px 0px 5px 20px;
	}
	 .line_info_top {
		height: 50px;
	}
	 .line_info_box {
		display: inline;
		width: 80%;
		float: left;
	}
	 .line_info_lable {
		font-size: 15px;
		padding: 5px 0px;
	}
	 .line_info_tips {
		display: inline;
		float: left;
		font-size: 12px;
	}
	 .line_info_tips span{
		padding-right: 20px;
	}
	 .line_opt{
		display: inline;
		float: right;
		width: 20%;
		height: 50px;
		text-align: center;
		line-height: 50px;
		font-size: 20px;
	}
	 .line_info_clear{
		height: 1px;
		background-color: #ddd;
		margin: 5px 0px;
	}
	 .line_plan_tips{
		white-space:normal;
		font-size: 12px;
	}
	 .line_plan_tips span{
		padding-right: 15px;
	}
	
	.search-box {
		margin: 0px;
		padding: 0px 0px;
		background-color: #f5f5f5;
	}
	

</style>

<ion-view title="预订"  id="bookingPage">
	<ion-nav-buttons side="left">
    	<button class="button button-clear icon ion-ios-arrow-back" ng-click="backGo()"></button>
    </ion-nav-buttons>
    <ion-tabs class="tabs-top tabs-striped has-header">
        <ion-tab title="已开线路" on-select="customerLines.query();">
        	<ion-view>  
           		<ion-content class="content has-header" scroll="false">
           				<div class="search-box" >
						  <label class="item item-input">
						    <i class="icon ion-search placeholder-icon"></i>
						    <input type="text" ng-model="customerLines.searchKey" placeholder="搜索">
						  </label>
						</div>
	            		<ion-scroll direction="y" style="height:90%;">
		            		<ion-list>
		            			<div class="item" style="text-align:center;" ng-show="customerLines.catalogs.length == 0">
		            				未查询到数据
			            		</div>
			            		<div class="line_catagoy" ng-repeat="catalog in customerLines.catalogs">
			            			<div class="item item-divider"
			            				 ng-bind-html="catalog.catalog.replace(customerLines.searchKey,'<font color=\'red\' style=\'background-color:yellow;\'>' + customerLines.searchKey + '</font>') | to_trusted">
			            			</div>
								  	<a class="item line_item" href="javascript:;" ng-click="customerLines.booking(line)" ng-repeat="line in catalog.lines">
								  		<div class="line_info_top">
								  			<div class="line_info_box">
									  			<div class="line_info_lable"
									  				ng-bind-html="line.lineName.replace(customerLines.searchKey,'<font color=\'red\' style=\'background-color:yellow;\'>' + customerLines.searchKey + '</font>') | to_trusted">
			            						</div>
			            						<div class="line_info_tips">
				            						<span style="">票价：{{line.price  | currency : '￥'}}</span>
				            						<span>里程：{{line.mileage||'-'}} km</span>
			            						</div>
								  			</div>
								  			<div class="line_opt">
		            							<i class="icon ion-ios-arrow-right"></i>
		            						</div>
								  		</div>
								  		<div class="line_info_clear"></div>
		            					<div class="line_plan_tips">
			            					<i class="icon ion-clock"></i> <span ng-repeat="plan in line.plans">{{plan.departTime}}</span>
		           						</div>
		            				</a>
			            		</div>
			            		<div style="height: 100px;"></div>
		                	</ion-list>
	            		</ion-scroll>
           		</ion-content>
           </ion-view>  
        </ion-tab>
        <ion-tab title="新线招募" on-select="newLines.query();">
            <ion-view>  
           		<ion-content class="content has-header" scroll="false">
           				<div class="search-box" >
						  <label class="item item-input">
						    <i class="icon ion-search placeholder-icon"></i>
						    <input type="text" ng-model="newLines.searchKey" placeholder="搜索">
						  </label>
						</div>
	            		<ion-scroll direction="y" style="height:90%;">
		            		<ion-list>
		            			<div class="item" style="text-align:center;" ng-show="newLines.catalogs.length == 0">
		            				未查询到数据
			            		</div>
			            		<div class="line_catagoy" ng-repeat="catalog in newLines.catalogs">
			            			<div class="item item-divider"
			            				 ng-bind-html="catalog.catalog.replace(newLines.searchKey,'<font color=\'red\' style=\'background-color:yellow;\'>' + newLines.searchKey + '</font>') | to_trusted">
			            			</div>
								  	<a class="item line_item" href="javascript:;" ng-click="newLines.booking(line)" ng-repeat="line in catalog.lines">
								  		<div class="line_info_top">
								  			<div class="line_info_box">
									  			<div class="line_info_lable"
									  				ng-bind-html="line.lineName.replace(newLines.searchKey,'<font color=\'red\' style=\'background-color:yellow;\'>' + newLines.searchKey + '</font>') | to_trusted">
			            						</div>
			            						<div class="line_info_tips">
				            						<span style="">票价：{{line.price  | currency : '￥'}}</span>
				            						<span>里程：{{line.mileage||'-'}} km</span>
			            						</div>
								  			</div>
								  			<div class="line_opt">
		            							<i class="icon ion-ios-arrow-right"></i>
		            						</div>
								  		</div>
								  		<div class="line_info_clear"></div>
		            					<div class="line_plan_tips">
			            					<i class="icon ion-clock"></i> <span ng-repeat="plan in line.plans">{{plan.departTime}}</span>
		           						</div>
		            				</a>
			            		</div>
			            		<div style="height: 100px;"></div>
		                	</ion-list>
	            		</ion-scroll>
           		</ion-content>
           </ion-view>
        </ion-tab>
        <ion-tab title="职工专线" on-select="staffLines.query();">
           <ion-view>  
           		<ion-content class="content has-header" scroll="false">
           				<div class="search-box" >
						  <label class="item item-input">
						    <i class="icon ion-search placeholder-icon"></i>
						    <input type="text" ng-model="staffLines.searchKey" placeholder="搜索">
						  </label>
						</div>
	            		<ion-scroll direction="y" style="height:90%;">
		            		<ion-list>
		            			<div class="item" style="text-align:center;" ng-show="staffLines.catalogs.length == 0">
		            				未查询到数据
			            		</div>
			            		<div class="line_catagoy" ng-repeat="catalog in staffLines.catalogs">
			            			<div class="item item-divider"
			            				 ng-bind-html="catalog.catalog.replace(staffLines.searchKey,'<font color=\'red\' style=\'background-color:yellow;\'>' + staffLines.searchKey + '</font>') | to_trusted">
			            			</div>
								  	<a class="item line_item" href="javascript:;" ng-click="staffLines.booking(line)" ng-repeat="line in catalog.lines">
								  		<div class="line_info_top">
								  			<div class="line_info_box">
									  			<div class="line_info_lable"
									  				ng-bind-html="line.lineName.replace(staffLines.searchKey,'<font color=\'red\' style=\'background-color:yellow;\'>' + staffLines.searchKey + '</font>') | to_trusted">
			            						</div>
			            						<div class="line_info_tips">
				            						<span style="">票价：{{line.price  | currency : '￥'}}</span>
				            						<span>里程：{{line.mileage||'-'}} km</span>
			            						</div>
								  			</div>
								  			<div class="line_opt">
		            							<i class="icon ion-ios-arrow-right"></i>
		            						</div>
								  		</div>
								  		<div class="line_info_clear"></div>
		            					<div class="line_plan_tips">
			            					<i class="icon ion-clock"></i> <span ng-repeat="plan in line.plans">{{plan.departTime}}</span>
		           						</div>
		            				</a>
			            		</div>
			            		<div style="height: 100px;"></div>
		                	</ion-list>
	            		</ion-scroll>
           		</ion-content>
           </ion-view>   
        </ion-tab>
	</ion-tabs>
</ion-view>